<p><a href="/posts/1-my-first-post/" class="nav-list-item ">My First Post</a></p>
            <p><a href="/posts/2-second-post/" class="nav-list-item ">My Second Post</a></p>
            <p><a href="/posts/3-third-post/" class="nav-list-item selected">My Third Post</a></p>
            <p><a href="/posts/4-fourth-post/" class="nav-list-item ">My Fourth Post</a></p>
            <p><a href="/posts/5-fifth-post/" class="nav-list-item ">My Fifth Post</a></p>
            <p><a href="/posts/6-sixth-post/" class="nav-list-item ">My Sixth Post</a></p>
            <p><a href="/posts/7-blade-post/" class="nav-list-item ">My Blade Post</a></p>
    

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <link rel="stylesheet" href="http://jigsaw.test/css/main.css">
    </head>
    <body class="border-t-3 border-primary full-height">

        <nav class="navbar navbar-brand">
            <div class="container">
                <div class="navbar-content">
                    <div>
                        <a class="link-plain text-xxl flex-y-center" href="http://jigsaw.test">
                            <strong>Jigsaw Collections Demo</strong>
                        </a>
                    </div>
                </div>
            </div>
        </nav>

        <div class="container m-xs-b-6">
            <div class="row">

                <div class="col-xs-4">
                    <nav class="nav-list">
    <a class="nav-list-item selected" href="http://jigsaw.test/posts">
        <icon></icon>Posts
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/pagination">
        <icon></icon>Pagination
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/categories/news">
        <icon></icon>Categories
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/people">
        <icon></icon>People
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/variables">
        <icon></icon>Variables
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/json-test.json">
        <icon></icon>JSON
    </a>

    <a class="nav-list-item " href="http://jigsaw.test/text-test.txt">
        <icon></icon>Text
    </a>
</nav>
                    <div class="panel m-xs-t-6">
    <div class="panel-heading">
        <h4 class="text-sm wt-light text-uppercase text-brand">Page meta</h4>
    </div>

    <div class="panel-body">
        <div class="p-xs-b-4 border-b">
            <p class="text-xs text-dark-soft text-uppercase">Filename:</p>
            <p class="p-xs-l-2 text-sm">3-third-post</p>
        </div>

        <div class="p-xs-y-4 border-b">
            <p class="text-xs text-dark-soft text-uppercase">Extension:</p>
            <p class="p-xs-l-2 text-sm">blade.php</p>
        </div>

        <div class="p-xs-y-4 border-b">
            <p class="text-xs text-dark-soft text-uppercase">Path:</p>
            <p class="p-xs-l-2 text-sm">/posts/3-third-post/</p>
        </div>

        <div class="p-xs-y-4 border-b">
            <p class="text-xs text-dark-soft text-uppercase">Base URL:</p>
            <p class="p-xs-l-2 text-sm">http://jigsaw.test</p>
        </div>

        <div class="p-xs-y-4 border-b">
            <p class="text-xs text-dark-soft text-uppercase">URL:</p>
            <p class="p-xs-l-2 text-sm">http://jigsaw.test/posts/3-third-post/</p>
        </div>

        <div class="p-xs-t-4">
            <p class="text-xs text-dark-soft text-uppercase">Global Variable:</p>
            <p class="p-xs-l-2 text-sm">some global variable</p>
        </div>
    </div>
</div>
                                    </div>

                <div class="col-xs-8 demo-page">
                        <h4 class="text-uppercase text-dark-soft wt-light">
        Collection Name: <strong>posts</strong>
        <br>
        Collection Name: <strong>posts</strong>
        <br>
        Total Posts: <strong>7</strong>
    </h4>

    <br>

    <h1>My Third Post</h1>
    <h1>My Blade Post</h1>

    <p><small>By Adam Wathan · 04/12/2017 </small></p>
    <p><small>By Keith Damiani · 03/01/2016 </small></p>

    <div class="border-t border-b p-xs-t-6 m-xs-b-6">
        <p class="text-xs text-dark-soft">References to adjacent collection items:</p>

        <div class="row">
            <div class="col-xs-6 text-left">

                                <p><a href="http://jigsaw.test/posts/2-second-post/">
                    <icon class="chevron_left m-xs-r-2"></icon>
                    My Second Post
                </a></p>
                
            </div>

            <div class="col-xs-6 text-right">

                                <p><a href="http://jigsaw.test/posts/4-fourth-post/">
                    My Fourth Post
                    <icon class="chevron_right m-xs-l-2"></icon>
                </a></p>
                
            </div>
        </div>
    </div>

    
<p>This file, named <strong>My Third Post</strong>, ends in <code>blade.php</code>, and therefore gets processed as by the Blade parser. It does not get parsed as a Markdown file.</p>

<p><em>NOTE: Blade-only collection items do not have a <code>getContent()</code> value at the moment. So functions that rely on it, such as the user-defined <code>preview()</code> function, will not return anything for now.</em></p>

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat, placeat saepe, voluptatibus dignissimos expedita quae et sit quia ipsa error blanditiis delectus at consequatur doloremque ratione nesciunt commodi nihil temporibus.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos tempora nostrum veritatis neque aliquam earum. Rerum accusamus repudiandae esse tempore doloribus necessitatibus natus ut ea, asperiores deserunt sequi cupiditate repellendus!


    <div class="border-t border-b m-xs-t-6 p-xs-y-6">
        <p class="text-xs text-dark-soft">User-defined helper function <code>preview()</code> from <code>collections.php</code>, invoked at the item level:</p>

        <p class="text-sm"><em> ...</em></p>
    </div>

        <div class="border-b p-xs-y-6">
        <p class="text-xs text-dark-soft">User-defined helper function, invoked on adjacent collection items</p>

        <h4><strong>My Fourth Post</strong></h4>

        <p class="text-sm"><em>
    A Blade/Markdown hybrid.


This filename ends with blade.md and is processed by both the Blade ...</em></p>
    </div>
    
    <div class="border-b p-xs-y-6">
        <p class="text-xs text-dark-soft">Access a Jigsaw Collection as Illuminate Collection</p>

        <h4>Related <a href="http://jigsaw.test/categories/faq"><em>faq</em></a> posts:</h4>

        <div class="row">
                        <div class="col-xs-9 col-xs-offset-3 p-xs-y-2 border-b">
                <a href="http://jigsaw.test/posts/3-third-post/">My Third Post</a>:
                <em>...</em>
            </div>
                        <div class="col-xs-9 col-xs-offset-3 p-xs-y-2 border-b">
                <a href="http://jigsaw.test/posts/4-fourth-post/">My Fourth Post</a>:
                <em>
    A Blade/Markdown hybrid.


This filename ends...</em>
            </div>
                        <div class="col-xs-9 col-xs-offset-3 p-xs-y-2 border-b">
                <a href="http://jigsaw.test/posts/6-sixth-post/">My Sixth Post</a>:
                <em>...</em>
            </div>
                    </div>
    </div>

    <div class="border-b p-xs-y-6">
        <p class="text-xs text-dark-soft">Dump of <code>$page</code> (can also be accessed as singular version of collection name, i.e. <code>$post</code>)</p>
    </div>
                </div>
            </div>
        </div>
    </body>
</html>
<!DOCTYPE html>
